import { Col, Form, type FormInstance, type FormItemProps } from 'antd';
import { isArray } from 'lodash';
import { useMemo } from 'react';
import { useModel } from 'umi';

type RenderChildren = (form: FormInstance) => React.ReactNode;
type ChildrenType = RenderChildren | React.ReactNode;
const FormAuth: React.FC<
  {
    children: ChildrenType;
    span?: number;
    name?: any;
    onClick?: () => void;
  } & FormItemProps
> = (props) => {
  const { children, span, name, ...rest } = props;
  const { key } = useModel('stepModel');

  //  目前name没做数组判断
  const isShow = useMemo(() => {
    const authList =
      (Array.isArray(key)
        ? key
        : Object.values(key || {})
            .flat()
            .map((item) => item.key)) || [];
    if (authList.length == 0) {
      return true;
    }

    // 单独处理
    if (['cardNumber1', 'cardNumber2'].includes(name)) {
      return authList.includes('cardNumber');
    } else {
      return authList.includes(isArray(name) ? name[1] : name);
    }
  }, [name, key]);
  return isShow ? (
    <Col span={span || 6}>
      {
        <Form.Item name={name} {...rest}>
          {children}
        </Form.Item>
      }
    </Col>
  ) : null;
};

export default FormAuth;
